<script src="<?=n_js('skin','jquery.cookie')?>"></script>
<style>
.fixed{position: fixed;right:48px;bottom:0px;}
#weixin-competelist{width:250px;margin-top:20px;background-color:#fff;}
#weixin-competelist dt{border-radius:5px;line-height:64px;background-color:#3E3470;color:#fff;text-align:center;font-weight: bold;font-size:18px;}
#weixin-competelist dd{background-color:#E6E6E6;padding-bottom:10px;}
#weixin-competelist dd > div{background-color:#F2F6F9;margin-top:6px;}
#weixin-competelist dd > div > div{background-color:#fff;}
#weixin-competelist dd > div > div > img{border-radius:50px;width:28px;padding:10px;}
#weixin-competelist dd > div > div > span{display:inline-block;width:120px;padding-left:8px;}
#weixin-competelist dd > div > div > a{padding-right:4px;}
#weixin-competelist .go-compete{display:block;width:147px;height:32px;margin:0 auto;line-height:32px;text-align:center;color:#fff;background-color:#3E3470;border-radius: 5px;margin-top:12px;}

.removebtn{display:block;text-align: right;background-color:#A3B2D3;}
</style>
<script>
var minH = 0;
var maxH = 1000000;
$(document).ready(function(){
	refixed();
	init();



	$(".go-compete").click(function(){
		if($("#weixin-competelist dd div.checked").length!=2){
			//$('.go-compete').attr("href","javascript:void(0);");
			alert('请选择2个公共号');
			return false;
		}
		var com1 = '';
		var com2 = '';
		$("#weixin-competelist dd div.checked").each(function(){
			//alert(1);
			if(com1==''){
				com1 = $(this).find('.checkbtn').attr('wxid');
			}else{
				com2= $(this).find('.checkbtn').attr('wxid');
			}
		});
		$('.go-compete').attr('href',"/weixin/compete.html?compete1="+com1+"&compete2="+com2)
		
	});



});
$(document).scroll(function(){refixed();});
function refixed(){
	minH = $("#weixin-competelist").position()['top'];
	maxH = $(document).height()-$(window).height()-59;
	
	/**
	if($(document).scrollTop()<minH){

		$("#weixin-competelist").removeClass("fixed");
		return ;
	}
	*/

	$("#weixin-competelist").addClass("fixed");	
	if($(document).scrollTop()>=maxH){
		$("#weixin-competelist").css({"bottom":$(document).scrollTop()-maxH+4});
		return ;
	}
	$("#weixin-competelist").css({"bottom":"4px"});
}


function removea(obj){
	//alert(3);
	//alert($(obj).parent().html());
	$(obj).parent().parent().remove();
	if($('#weixin-competelist > dd > div').length == 0){
		hsHide();
	};

	fixedNum();

	var competeStr = $.cookie('compete');
	if(competeStr){
		var compete = competeStr.split(';');
	}
	var newCompete = [];
	for(var i in compete){
		var itemInfo = compete[i].split('----');
		
		if(itemInfo[0] != $(obj).attr('wxid')){
			newCompete.push(compete[i]);
		}
	}
	$.cookie('compete',newCompete.join(';'));


}
function toggle(obj){
	var pdiv = $(obj).parent();
	var type = pdiv.hasClass("checked")?1:0;
	if(type==0 && $('#weixin-competelist > dd > div > div.checked').length>=2){
		alert("只能选择2个公共号");
		return false;
	}
	pdiv.toggleClass('checked');

	var ctype = 1 - type;
	pdiv.find(".checkbtn img").attr('src','/weixin/img/check-'+ctype+'.png');
	pdiv.find(".removebtn img").attr('src','/weixin/img/remove-'+ctype+'.png');

}
function structNode(id,imgUrl,name){
	imgUrl = imgUrl
	var img = $("<img>").attr('src',imgUrl);
	var nameHtml = $("<span>").text(name);
	var check = $("<a>")
					.addClass('checkbtn')
					.attr('wxid',id)
					.attr('href','javascript:void(0)')
					.click(function(){toggle(this);})
					.append("<img src='/weixin/img/check-0.png' />");
	var remove = $("<a>")
						.addClass('removebtn')
						.attr('wxid',id)
						.attr('href','javascript:void(0)')
						.click(function(){removea(this);})
						.append("<img src='/weixin/img/remove-0.png' />");
	$("<div>").append($("<div>")
				.append(remove)
				.append(img)
				.append(nameHtml)
				.append(check)
				)
				.prependTo('#weixin-competelist dd');
	hsShow();

}
function fixedNum(){
	var len = $("#weixin-competelist dd > div").length;
	$("#weixin-competelist dt > span.num").text('('+len+'/5)');
}

function add(id,imgUrl,name){
	
	if($("#weixin-competelist dd > div a[wxid="+id+"]").length!=0){
		alert('公共号已添加');
		return false;
	}
	var len = $("#weixin-competelist dd > div").length;
	if(len>4){
		alert('最多只能添加5个公共号');
		return false;
	}


	structNode(id,imgUrl,name);
	fixedNum();
	
	var compete = $.cookie('compete');
	if(compete){
		compete += ';'+id+'----'+imgUrl+'----'+name;
	}else{
		compete = id+'----'+imgUrl+'----'+name;
	}
	$.cookie('compete',compete,{path:"/"});
}
function init(){
	$('.go-compete').hide();
	
	var compete = $.cookie('compete');
	if(compete){
		$.cookie('compete', "", { expires: -1 });
		$.cookie('compete',compete,{path:"/"});
		
		compete = compete.split(';');
		for(var i in compete){
			if(compete[i]=="")break;
			var itemInfo = compete[i].split('----');
			
			structNode(itemInfo[0],itemInfo[1],itemInfo[2]);
		}
	}else{
		$.cookie('compete','',{path:"/"});
	}
	
}
function hsShow(){
	$('#weixin-competelist > dt > img').attr('src','/weixin/img/hs-toggle-up.png');
	if($('#weixin-competelist > dd > div').length != 0){
		$('.go-compete').show();
	}

	$("#weixin-competelist dd > div").show();
}
function hsHide(){
	$('#weixin-competelist > dt > img').attr('src','/weixin/img/hs-toggle.png');
	$("#weixin-competelist dd > *").hide();
}

function hsToggle(obj){
	if($(obj).attr('src')=='/weixin/img/hs-toggle.png'){
		hsShow();
	}else{
		hsHide();
	}
}
</script>

<dl id="weixin-competelist">
	<dt>对比公众号
		<span class="num"></span>
		<img onclick="hsToggle(this)" src="/weixin/img/hs-toggle.png" />
		</dt>
	<dd>
		<a class="go-compete" href="javascript:void(0);" target="_blank">开始对比</a>
	</dd>
</dl>
